<template>
  <div class="app-container">
    <h3>挂号信息</h3>
    <el-form
      :model="patient"
      :rules="rules"
      ref="form"
      label-width="100px"
      class="demo-form"
    >
      <el-col :span="6">
        <el-form-item label="病历号" prop="pid">
          <el-input v-model="patient.pid"></el-input>
        </el-form-item>
      </el-col>
      <el-col :span="6">
        <el-form-item label="姓名" prop="pname">
          <el-input v-model="patient.pname"></el-input>
        </el-form-item>
      </el-col>
      <el-col :span="6">
        <el-form-item label="年龄" prop="age">
          <el-input v-model="patient.age"></el-input>
        </el-form-item>
      </el-col>
      <el-col :span="6">
        <el-form-item label="性别" prop="sex">
          <el-radio-group v-model="patient.sex">
            <el-radio label="男"></el-radio>
            <el-radio label="女"></el-radio>
          </el-radio-group>
        </el-form-item>
      </el-col>
      <el-col :span="12">
        <el-form-item label="身份证" prop="idcard">
          <el-input v-model="patient.idcard"></el-input>
        </el-form-item>
      </el-col>
      <el-col :span="6">
        <el-form-item label="住址" prop="address">
          <el-input v-model="patient.address"></el-input>
        </el-form-item>
      </el-col>
     <el-col :span="6">
        <el-form-item label="挂号日期" prop="createdate">
            <el-input v-model="patient.createdate"></el-input>
        </el-form-item>
      </el-col>
      <el-col :span="6">
        <el-form-item label="科室" prop="deptname">
            <el-input v-model="patient.deptname"></el-input>
        </el-form-item>
      </el-col>
      <el-col :span="6">
        <el-form-item label="医生" prop="dname">
             <el-input v-model="patient.dname"></el-input>
        </el-form-item>
      </el-col>
      <el-col :span="12">
        <el-form-item label="级别" prop="levelname">
            <el-input v-model="patient.levelname"></el-input>
        </el-form-item>
      </el-col>
       <el-col :span="6">
        <el-form-item label="总金额" prop="cost">
          <span>{{patient.cost|costFilter}}</span>
        <!-- <el-input disabled v-model="patient.cost"></el-input> -->
         </el-form-item
      ></el-col>
      <el-col :span="18">
        <el-form-item>
          <el-button type="primary" @click="updatePatientById"
            >立即退号</el-button
          >
          <el-button type="primary" @click="getPatientById"
            >立即查询</el-button
          >
          <el-button @click="resetForm('form')">重置</el-button>
        </el-form-item>
      </el-col>
    </el-form>
    <h3>挂号患者信息</h3>
    <el-form
              :model="patient"
              :inline="true"
              :rules="rules"
              ref="form"
              label-width="40px"
              class="demo-form"
            >
              <el-form-item label="姓名" prop="pname">
                <el-input v-model="patient.pname"></el-input>
              </el-form-item>
              <el-form-item>
                <el-button type="primary" @click="fetchDataPage2(1,3)"
                  >查询</el-button
                >
                <el-button type="primary" @click="resetForm1('form')"
                  >重置</el-button
                >
              </el-form-item>
            </el-form>
    <el-table
      v-loading="listLoading"
      :data="patientList"
      element-loading-text="Loading"
      border
      fit
      highlight-current-row
    >
     <el-table-column prop="pid" label="病例号" width="180">
      </el-table-column>
      <el-table-column prop="pname" label="患者姓名" width="180">
      </el-table-column>
        <el-table-column prop="deptname" label="科室" width="180">
      </el-table-column>
       <el-table-column prop="dname" label="医生" width="180">
      </el-table-column>
       <el-table-column prop="levelname" label="级别" width="180">
      </el-table-column>
       <el-table-column prop="pstatus" label="状态" width="180">
      </el-table-column>
       <el-table-column prop="address" label="地址" >
      </el-table-column>
       <el-table-column prop="createdate" label="日期" width="180">
      </el-table-column>
    </el-table>
    <div class="block">
      <span class="demonstration"></span>
      <el-pagination
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :current-page="pageBean.currentPage"
        :page-sizes="pageBean.pageSizes"
        :page-size="pageBean.pageSize"
         layout="total, sizes, prev, pager, next, jumper"
        :total="pageBean.total"
      >
      </el-pagination>
    </div>
  </div>
</template>

<script>
import user from "@/api/user";
import patient from "@/api/patient";
export default {
  name: "Registration",
  data() {
    return {
      exTimeOption:{
        disabledDate(date){
          return date.getTime()<=Date.now();
        }
      },
      currentPage4: 4,
      list: null,
      listLoading: false,
      patient: {
        pid: "",
        pname: "",
        sex: "",
        age: "",
        address: "",
        createdate: "",
        operatedate:"",
        deptname:"",
        levelname:"",
        cost:0,
      },
      rules: {

      },
      deptList:[],
      doctorList:[],
      levelList:[],
      cost:0,
      records:false,
      patientList:[],
      listLoading:false,
       pageBean:{
            total:0,
            pageSizes:[1,2,3,4],
            pageSize:3,
            currentPage:1
        },
    };
  },
  filters: {
    costFilter(cost){
        return cost+'$'
    }
  },
  watch: {},
  methods: {
    handleSizeChange(pageSize) {
      this.pageBean.pageSize=pageSize;
      this.fetchDataPage(this.pageBean.page,pageSize);
    },
    handleCurrentChange(page) {
     let ps=this.pageBean.pageSize;
     this.fetchDataPage(page,ps);
    },
    resetForm(formName) {
      this.$refs[formName].resetFields();
    },
    resetForm1(formName) {
      this.$refs[formName].resetFields();
      this.fetchDataPage();
    },
    fetchDataPage(page=1,pageSize){
        pageSize=this.pageBean.pageSize
        this.listLoading = true;
        patient.getPatientListPage(page,pageSize).then(response => {
        this.patientList=[]
        this.patientList = response.data.patientMap.patientList;
        this.pageBean.total=response.data.patientMap.total
        this.listLoading = false;

      });
    },
    fetchDataPage2(page=1,pageSize){
        let pname=this.patient.pname
        pageSize=this.pageBean.pageSize
        this.listLoading = true;
        patient.getPatientListPage2(page,pageSize,pname).then(response => {
        this.patientList=[]
        this.patientList = response.data.patientMap.patientList;
        this.pageBean.total=response.data.patientMap.total
        this.listLoading = false;

      });
    },
    getPid(){
    patient.getPid().then(res=>{
      this.patient.pid=res.data.pid
    });
    },
    getDeptList(){
       patient.getDeptList().then(res=>{
      this.deptList=res.data.deptList
    });
    },
    changeDeptId(val){
      //console.log(val);
      this.doctorList=[];
      this.patient.doctorid="";
       patient.getDoctorListById(val).then(res=>{
         console.log(res.data.doctorList);
         this.doctorList=res.data.doctorList
    });
    },
    getLevelList(){
       patient.getLevelList().then(res=>{
      this.levelList=res.data.levelList
           });
    },
    getPatientList(){
       patient.getPatientList().then(res=>{
      this.patientList=res.data.patientList
           });
    },
    changeRecords(){
      this.patient.cost=this.cost+this.records
    },
     changeLevelId(id){
       if(id==1)
      {
        this.cost=20
      } 
       else
       {
          this.cost=100
       }
       console.log(id)
       this.patient.cost=this.cost+this.records
    },
    getPatientById(){
        let pid=this.patient.pid;
        patient.getPatientById(pid).then(res=>{
            console.log(this.patient.pstatus)
            if(res.code==20000){
               this.patient= res.data.patient;
            }
            else
            {
                this.$notify.error({
                    title:"错误",
                    message:"查询失败"
                });
            }
        });
    },
    updatePatientById(){
      let pid=this.patient.pid;
      if(pid!=""&&this.patient.pstatus==1)
      {
          patient.updatePatientById(pid).then(res=>{
                this.$notify({
                 title:"退号成功",
                 message:"退号成功",
                 type:"success"
           });
          this.fetchDataPage(); 
          });
      }
      else{
          this.$notify.error({
              titler:"错误",
              message:"不允许退号"
          });
      }

    },
  },
  created() {
     this.getDeptList();
     this.getLevelList();
     this.fetchDataPage();
      //this. getPatientById();
      //this. updatePatientById();
  }
};
</script>

<style lang="scss">
</style>
